<template>
  <section class="setting-bg pv-12 ph-16">
    <h3>授权管理</h3>
    <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
      <el-row align="middle" style="width: 500px;">
        <el-col :span="12">
          <h4>授权码</h4>
        </el-col>
        <el-col :span="12">
          <el-input v-model="authCode" placeholder="输入授权码">
          </el-input>
        </el-col>
      </el-row>
    </div>
    <div style="max-width: 400px;justify-content: space-between;" class="flex-row-center">
      <el-row align="middle" style="width: 500px;">
        <el-col :span="12">
          <h4>随机字符串</h4>
        </el-col>
        <el-col :span="12">
          <el-input v-model="nonce" placeholder="输入随机字符串">
          </el-input>
        </el-col>
      </el-row>
    </div>
    <el-button style="margin-top: 40px;" type="primary" @click="save">保存</el-button>
  </section>
</template>
<script setup name="Auth">

import { getInfo as getConfig, edit } from '@/api/setting/waterElectricity'
const { proxy } = getCurrentInstance()

const authCode = ref('')
const nonce = ref('')
const configId = ref('')

function getInfo() {
  getConfig().then(res => {
    const data = res.data
    authCode.value = data.auth
    nonce.value = data.noStr
    configId.value = data.waterElectricityConfigId
  })
}

function save() {
  const params = {
    auth: authCode.value,
    noStr: nonce.value
  }
  if (configId.value !== '') {
    params.waterElectricityConfigId = configId.value
  }
  edit(params).then(res => {
    if (res.code === 200) {
      proxy.$modal.msgSuccess('保存成功')

      getInfo()
    }
  })
}

getInfo()

</script>
